.real-time-monitoring {
  display: flex;
  margin-top: 0.5rem;
  position: relative;
  .real-time-left {
    flex: 50%;
    position: relative;
    .real-time-left-title {
      position: absolute;
      color: #fff;
      font-size: 24px;
      left: 129px;
      top: 24px;
      img {
        display: inline-block;
        margin-top: -43px;
      }
    }
    .real-time-left-top {
      display: flex;
      position: absolute;
      right: 31px;
      top: 46px;
      .boxes {
        margin-left: 30px;
      }
    }
    .real-time-left-bottom {
      margin-top: 8.75rem;
      position: relative;
      .left-bottom-content {
        width: 19.75rem;
        height: 19.75rem;
        margin: auto;
        img {
          width: 19.75rem;
        }
      }
      .left-bottom-list {
        position: absolute;
        top: 0;
        width: 100%;
        height: 100%;
        .list {
          position: absolute;
        }
        .right {
          position: absolute;
          right: 1.875rem;
        }
        .left {
          left: 1.875rem;
        }
        .A {
          top: 2.625rem;
        }
        .B {
          top: 10.125rem;
        }
        .C {
          bottom: -1.875rem;
        }
        .D {
          bottom: 2rem;
        }
        .E {
          top: 6.8rem;
        }
        .F {
          top: -0.5rem;
        }
      }
    }
  }
  .real-time-right {
    flex: 50%;
    .real-time-right-top {
      margin: 5.795rem 0 7.795rem;
      position: relative;
      .real-time-right-top-title {
        position: absolute;
        color: #fff;
        font-size: 24px;
        top: -58px;
        left: 109px;
        .top-title-img {
          display: inline-block;
          margin-top: -43px;
        }
      }
      .right-top-content {
        width: 12.875rem;
        height: 12.25rem;
        margin: auto;
        img {
          width: 12.875rem;
          height: 12.25rem;
        }
      }
      .right-top-list {
        position: absolute;
        top: 0;
        width: 100%;
        height: 100%;
        .tight-top {
          position: absolute;
        }
        .top {
          left: 40%;
          top: -4.75rem;
        }
        .right {
          right: 5.875rem;
          top: 4.125rem;
        }
        .bottom {
          left: 40%;
          bottom: -3.75rem;
        }
        .left {
          left: 5.875rem;
          top: 4.125rem;
        }
      }
    }
    .real-time-right-bottom {
      position: relative;
      margin-top: 2.5rem;
      .real-time-right-bottom-title {
        color: #fff;
        font-size: 24px;
        position: absolute;
        top: -60px;
        left: 118px;
        img {
          display: inline-block;
          margin-top: -43px;
        }
      }
      .real-time-right-bottom-content {
        display: flex;
        justify-content: space-around;
        padding: 0 3.75rem;
      }
    }
  }
  .real-time-select {
    position: absolute;
    top: -4.125rem;
    right: 1.25rem;
  }
}
